<!DOCTYPE html>
<html>
	<head>
		<meta charset="utf-8">
		<title></title>
		<script src="js/jquery.min.js"></script>
	</head>
	<body>
		<div id="msg">又大又红</div>
		
		<button id="pay" onclick="doLogin()">支付宝支付</button>
		
		<div style="margin: 10px;">
			<!-- 页面上有很多组选择,怎么知道是一组呢? id必须相同-->
			<input type="checkbox" id="ck" checked="checked"/>红色
			<input type="checkbox" id="ck"/>绿色
			<input type="checkbox" id="ck"/>蓝色
			
			<div style="margin: 10px 0px 0px 40px;">
			<button id="SelectAll">全选</button>
			<button id="unSelectAll">取消</button>
			</div>
		</div>
	</body>
	<script>
		$().ready(function(){
			/*获取div对象,  设置css样式,改变字体大小*/
			$("#msg").css("font-size",36);   /*样式:font-size:36*/
			$("#msg").css("color","red");    /*样式:color:red*/
			
			/*给动态按钮绑定一个事件onclick*/
			/*onclick没有on,参数是匿名函数*/
			$("#pay").click(function(){       
				/*禁止按钮:html 属性: disable true禁止,false可以点击*/
				$("#pay").prop("disabled",true);  /*属性方法*/
			})
			
			/*实现全选,jQuery选择器[],过滤出我想要的元素,[id标签的id=ck(id给定的名称)]*/
			/*jQuery可以针对一组值进行设定*/
			$("#SelectAll").click(function(){
			$("[id=ck]").prop("checked",true);  /*所有ck的框全部选中*/
		  })
		  $("#unSelectAll").click(function(){
			  $("[id=ck]").prop("checked",false);
		  })
		})
	</script>
</html>
